import 'package:flutter/material.dart';

class MonthlyStatusListing extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(left: 10,right: 10,top: 20),
      child: Row(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: <Widget>[
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              MonthlyStatusRow(month: 'February 2017',name:'On going'),
              MonthlyStatusRow(month: 'Januray 2017',name:'Failed'),
              MonthlyStatusRow(month: 'December 2017',name:'Completed')
            ],
          ),
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,

            children: <Widget>[
              MonthlyStatusRow(month: 'Lose weight',name:'3.8 ktgt/7 kg',color:Colors.blueGrey),
              MonthlyStatusRow(month: 'Runing per month',name:'15.33 km/20 km',color:Colors.blueGrey),
              MonthlyStatusRow(month: 'Avg steps Per day',name:'10000/10000',color:Colors.blueGrey)
            ],
          )
        ],
      ),
    );
  }
}

class MonthlyStatusRow extends StatelessWidget {
  final String month ;
  final String name;
  final Color color;
  MonthlyStatusRow({this.month,this.name,this.color = Colors.blue});
  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Text(this.month,style: TextStyle(color:color,fontWeight: FontWeight.bold),),
        Text(this.name,style: TextStyle(fontSize: 10,color: Colors.grey),),
        SizedBox(height: 8.0,)
      ],
    );
  }

}
